<template>

  <div class="logo-container">
    <el-avatar src="/logo.jpg" fit="cover" size="default"/>
    <el-text :style="styles">{{ title }}</el-text>
  </div>


</template>

<script setup lang="ts">

defineProps({
  title: {
    type: String,
    default: '喵喵记账'
  },
  styles: {
    type: Object,
    default: () => {
      return {
        color: "#fff",
        fontSize: '20px'
      }
    }
  }
})
</script>

<style scoped lang="scss">
.logo-container {
  display: flex;
  align-items: center;
  flex-direction: row;
  padding-top: 10px;


  .el-text {
    margin-left: 10px;
  }
}
</style>
